<form id="edit-form" class="form-horizontal" role="form" data-toggle="validator" method="POST" action="">
    <script src="/assets/jquery.min.js"></script>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Acc_type')}:</label>
        <div class="col-xs-12 col-sm-8">
            <select id="c-acc_type" class="form-control selectpicker" name="row[acc_type]">
                {foreach name="accTypeList" item="vo"}
                <option value="{$key}" {in name="key" value="$row.acc_type"}selected{/in}>{$vo}</option>
                {/foreach}
            </select>
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Shouli_date')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-shouli_date" class="form-control datetimepicker" required data-date-format="YYYY-MM-DD" data-use-current="true" name="row[shouli_date]" type="text" value="{$row.shouli_date}"/>
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Zhanghao')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-zhanghao" class="form-control" name="row[zhanghao]" type="text" value="{$row.zhanghao|htmlentities}">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Password')}:</label>
        <div class="col-xs-12 col-sm-8">
            <div class="input-group">
                <input id="c-password" class="form-control" name="row[password]" type="password" value="{$row.password|htmlentities}">
                <span class="input-group-btn">
                    <button class="btn btn-default toggle-password" type="button" title="显示密码">
                        <i class="fa fa-eye"></i>
                    </button>
                </span>
            </div>
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Zhaoshu')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-zhaoshu" class="form-control" name="row[zhaoshu]" type="text" value="{$row.zhaoshu|htmlentities}">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Stop_date')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-stop_date" class="form-control datetimepicker" data-date-format="YYYY-MM-DD" data-use-current="true" name="row[stop_date]" type="text" value="{$row.stop_date}">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Name')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-name" class="form-control" name="row[name]" type="text" value="{$row.name|htmlentities}">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Mobile')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-mobile" class="form-control" name="row[mobile]" type="text" value="{$row.mobile|htmlentities}">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Address')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-address" class="form-control" name="row[address]" type="text" value="{$row.address|htmlentities}">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Card')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-card" class="form-control" name="row[card]" type="text" value="{$row.card|htmlentities}">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Is_yajin')}:</label>
        <div class="col-xs-12 col-sm-8">
            <select id="c-is_yajin" class="form-control selectpicker" name="row[is_yajin]">
                {foreach name="isYajinList" item="vo"}
                <option value="{$key}" {in name="key" value="$row.is_yajin"}selected{/in}>{$vo}</option>
                {/foreach}
            </select>
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('User_date')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-user_date" class="form-control datetimepicker" data-date-format="YYYY-MM-DD" data-use-current="true" name="row[user_date]" type="text" value="{$row.user_date}">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Guishu')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-guishu" class="form-control" name="row[guishu]" type="text" value="{$row.guishu|htmlentities}">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Zidan')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-zidan" class="form-control" name="row[zidan]" type="text" value="{$row.zidan|htmlentities}">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Remark')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-remark" class="form-control" name="row[remark]" type="text" value="{$row.remark|htmlentities}">
        </div>
    </div>
    <div class="form-group layer-footer">
        <label class="control-label col-xs-12 col-sm-2"></label>
        <div class="col-xs-12 col-sm-8">
            <button type="submit" class="btn btn-primary btn-embossed disabled">{:__('OK')}</button>
        </div>
    </div>
</form>

<style>
    .toggle-password {
        border: 1px solid #ccc;
        border-left: none;
        transition: all 0.3s ease;
    }
    .toggle-password:hover {
        background-color: #f8f9fa;
        color: #3498db;
    }
    .input-group .form-control:focus + .input-group-btn .toggle-password {
        border-color: #66afe9;
    }
</style>

<script>
    $(document).ready(function() {
        // 密码显示/隐藏功能
        $('.toggle-password').on('click', function() {
            var $button = $(this);
            var $icon = $button.find('i');
            var $passwordInput = $button.closest('.input-group').find('input');

            if ($passwordInput.attr('type') === 'password') {
                // 显示密码
                $passwordInput.attr('type', 'text');
                $icon.removeClass('fa-eye').addClass('fa-eye-slash');
                $button.attr('title', '隐藏密码');
            } else {
                // 隐藏密码
                $passwordInput.attr('type', 'password');
                $icon.removeClass('fa-eye-slash').addClass('fa-eye');
                $button.attr('title', '显示密码');
            }
        });

        // 处理表单提交时的密码字段
        $('#edit-form').on('submit', function() {
            // 确保密码字段在提交时是可见的（如果需要）
            // 这里可以根据需要调整
            return true;
        });
    });
</script>